import { Upload } from 'antd'
import React from 'react'

export interface CustomUploadType {
  // eslint-disable-next-line no-unused-vars
  onChange: (url: string) => void
  children?: React.DOMElement<any, any>
}

type CompoundedComponent = CustomUploadType
const CustomUpload = (props: CompoundedComponent) => {
  function handlerImageUpload(info: any) {
    if (info.file.status === 'done') {
      props.onChange(info.file.response.data[0].url)
    }
  }

  return (
    <Upload
      name="file"
      listType="picture-card"
      className="avatar-uploader"
      showUploadList={false}
      action="/api/file/upload"
      onChange={handlerImageUpload}
    >
      {props.children}
    </Upload>
  )
}

export default CustomUpload
